import Cookie from "js-cookie";

export default {
    state: {
        isCollapse: false,  // 控制菜单展开收起
        tabsList: [
            {
                path: '/',
                name: 'home',
                label: '首页',
                icon: 's-home',
                url: 'Home/Home'
            }
        ],       // 面包屑数据
        // 菜单栏目  
        menu: { }
    },
    mutations: {
        // 修改菜单展开收起的方法
        collapseMenu(state){
            state.isCollapse = !state.isCollapse;
        },
        
        // 更新面包屑数据  通过点击侧边菜单，触发改变面包屑拼接
        selectMenu(state, val){
            console.log(val, 'val')
            // 判断添加的数据是否为首页
            if(val.name !== "home"){
                const index = state.tabsList.findIndex(item => item.name === val.name)
                // 如果不存在 拼接面包屑
                if(index === -1){
                    state.tabsList.push(val)

                }
            }
        },
        // 定义删除指定的m tags 标签内容的方法，删除 tabsList
        closeTag(state, item){
            // console.log(item, 'closeTag')
            const index = state.tabsList.findIndex(val => val.name === item.name)
            state.tabsList.splice(index, 1)
        },

        // 设置 menu 数据
        setMenu(state, val){
            state.menu = val
            // 页面刷新 menu数据不存在 ，持久化处理
            Cookie.set('menu', JSON.stringify(val))
        },

        // 动态注册路由
        addMenu(state, router){
            // 判断缓存是否存在数据
            if(!Cookie.get('menu')) return
            const menu = JSON.parse(Cookie.get('menu'))
            state.menu = menu
            // 组装动态路由数据
            const menuArray = []
            menu.forEach(item => {
                if(item.children){
                    item.children = item.children.map(item => {
                        item.component = () => import(`../view/${item.url}`)
                        return item
                    })
                    menuArray.push(...item.children)
                } else {
                    item.component = () => import(`../view/${item.url}`)
                    menuArray.push(item)
                }
            });
            console.log(menuArray, 'menuArray')

            // 路由动态添加
            menuArray.forEach(item => {
                router.addRoute('Main', item)
            })
        }

    }
}